*{
  font-family: Avenir, sans-serif;
  font-size: 1em;
  text-align: center;
  margin: 0px;
  padding: 0px;
  box-sizing: border-box;
}
.conteneur-grid{
  display: grid;
  grid-template-columns: [ext-gauche] 1fr [centre-gauche] 2fr [centre-droite] 1fr [ext-droite];
  grid-template-rows: minmax(100px, 1fr) [body-sup] minmax(200px, 2fr) [body-inf] minmax(100px, 1fr);
  border: 2px solid red;
  background-color: #DDD;
  margin: 10px;
}
.conteneur-grid > div{
  padding: 20px 0px;
  background-color: #ED8;
  border: 1px dashed black;
}
.g1{
    grid-column-start: ext-gauche;
    grid-column-end: centre-droite;
    grid-row-start: 1;
}
.g2{
    grid-column-start: ext-gauche;
    grid-row-start: body-sup;
}
.g3{
    grid-column-start: centre-droite;
    grid-row-start: 1;
}
.g4{
    grid-column-start: ext-gauche;
    grid-column-end: centre-droite;
    grid-row-start: body-inf;
}
.g5{
    grid-column-start: centre-droite;
    grid-row-start: body-sup;
    grid-row-end: 4;
}